﻿/* required LIB STYLES */
/* .Treant se automatski dodaje na svaki chart conatiner */
.Treant { position: relative; overflow: hidden; padding: 0 !important; }
.Treant > .node,
.Treant > .pseudo { position: absolute; display: block; visibility: hidden; }
.Treant.Treant-loaded .node,
.Treant.Treant-loaded .pseudo { visibility: visible; }
.Treant > .pseudo { width: 0; height: 0; border: none; padding: 0; }

.Treant .collapse-switch {
    width: 22px !important;
    height: 22px !important;
    right: -13px !important;
    display: block;
    border: 2px solid #FFB000;
    position: absolute;
    top: 22px;
    cursor: pointer;
    border-radius: 20px;
    background-color: #ffffff;
    box-shadow: -1px 0px 2px rgba(0,0,0,0.3);
    background-image:url(../images/arrowleftbin.png);
    background-repeat:no-repeat;
    background-size:cover;
}

.Treant > .node.directUser .collapse-switch {top: 20px;}

.Treant .collapsed .collapse-switch {
    background-color: #FFB000; border: 2px solid #FFFFFF; background-image:url(../images/arrowrightbin.png);
}
.Treant > .node img {	border: none; float: left; }

.Treant > .node {
    padding: 6px 18px 6px 8px;
    background-color: #DE3832;
    border-radius: 5px;
    border: 0px solid #000000;
    box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
    font-size: 12px;
    transition: all 0.3s ease 0s;
}

.Treant > .node:hover, .Treant > .node:active, .Treant > .node:focus {text-decoration:none; background-color: #AE0802; transition: all 0.3s ease 0s;}
.Treant > .node.activeUser:hover {background-color: #577C09; transition: all 0.3s ease 0s;}
.Treant > .node.mainUser:hover {background-color: #0682c2;}

.Treant > .node p.node-deposit {
    text-align: center;
    color: #FFCF00;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.4);
    font-size: 14px;
}
.Treant > .node p.node-userId {
    text-align: center;
}
.Treant > .node p {
    color: #FFFFFF;
    top: 0px;
    position: relative;
    margin: 0;
}

.Treant > .node.activeUser {
    background-color: #7EA300;
    color: #3E6300;
    transition: all 0.3s ease 0s;
}

.Treant > .node.mainUser {
    background-color: #0682c2;
}

.Treant > .node.directUser {
    border: 2px solid #0682c2;
    padding: 4px 18px 4px 6px;
}

.affBtnsCont {
    margin-top: 13px;
    display: table;
    width: 100%;
    background-color: rgba(255,255,255,0.9);
    padding-top: 15px;
    border-radius: 6px;
    border: 1px solid rgba(0,0,0,0.2);
    box-shadow: 3px 3px 3px rgba(0,0,0,0.04);
}
